<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>抢购倒计时</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        .box {
            text-align: center;
            font-size: 30px;
            color: red;
        }
    </style>

    <script>
        window.onload = function () {

            var endTime = new Date('2020/11/11 23:59:59')
            function fn() {
                // 当前时间
                var currentTime = new Date()

                // 截止时间到当前时间，所有的秒数  1000毫秒=1秒
                var allS = (endTime.getTime() - currentTime.getTime()) / 1000
                // 获取天数
                var days = parseInt(allS / 60 / 60 / 24).toString().padStart(2, '0')
                // 获取小时数
                var hours = parseInt(allS / 60 / 60 % 24).toString().padStart(2, '0')

                // 获取分钟
                var minutes = 0
                var temp = allS - days * 24 * 60 * 60 - hours * 60 * 60
                if (temp > 0) {
                    minutes = parseInt(temp / 60).toString().padStart(2, '0')
                }
                var seconds = 0;
                var temps = allS - days * 24 * 60 * 60 - hours * 60 * 60 - minutes * 60
                if (temps > 0) {
                    seconds = parseInt(temps).toString().padStart(2, '0')
                }


                var str = `<h1>截止时间：2020-11-11 23:23:59</h1>
    <h1>还剩：${days}天${hours}时${minutes}分${seconds}秒</h1>
`
                document.querySelector('.box').innerHTML = str
            }


            // 开启一个定时器
            // 一直执行
            setInterval(fn, 1000)



        }
    </script>
</head>

<body>
    <div class="box"></div>
</body>

</html>